<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <base href="<%=basePath%>">
    
    <title>密保卡管理</title>
    
    <meta charset="utf-8"/>
	<meta http-equiv="pragma" content="no-cache">
	<meta http-equiv="cache-control" content="no-cache">
	<meta http-equiv="expires" content="0">    
	<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
	<meta http-equiv="description" content="This is my page">
	
	<script type="text/javascript" src="./gold/js/My97DatePicker/WdatePicker.js"></script>
	
	<link rel="stylesheet" href="gold/css/bootstrap.min.css">
	<script src="gold/js/jquery.js"></script>
	<script src="gold/js/bootstrap.min.js"></script>
	
	<style type="text/css">
		#container {
			margin-top: -20px;
			margin-left: 10px;
		}
		td {
			vertical-align: middle !important;
		}
	</style>
	
	<script type="text/javascript">
		$(function(){
			$("#all").click(function(){
				var all = $("#all").prop("checked");
				if(all){
					$("input[name='opt']").prop("checked",true);
				}else{
					$("input[name='opt']").prop("checked",false);
				}
			});
		});
		function chooseCard(){
			var v1 = confirm("确认删除吗？");
			if(v1){
				var arr = [];
				$("input[name='opt']").each(function(){
					var choose = $(this).prop("checked");
					if(choose){
						arr.push($(this).val());
					}
				});
				if(arr.length<=0){
					alert("请选择至少一行删除！");
					return;
				}
				location.href="deleteGame.do?gameIdStringArr="+arr;
			}
		}
		function getTime(obj){
			WdatePicker();
		}
	</script>

 
  </head>
  
  <body>
    <div>
		<div id="container">
			<div class="page-header ">
				<h2>密保卡管理</h2>
			</div>
			<form action="getCardByLike.do" method="post" enctype="multipart/form-data">
				<div class="row">
					<div class="col-xs-1 col-sm-12 ">
						<div class="row">
							<div class="col-xs-10 col-sm-3">
								<span class="btn btn-default">卡号 <input type="text" name="cardNumber"/> </span>
							</div>
							
							<div class="col-xs-5 col-sm-3 ">
								<div class="row">
									<div class="col-xs-6 col-sm-4 ">
										<span class="btn btn-default">有效期开始时间 <input 
											type="text"  readonly="readonly" name="cardStartTime" id="startTime"
											onclick="WdatePicker({maxDate:'#F{$dp.$D(\'endTime\')}',dateFmt:'yyyy-MM-dd HH:mm:ss'})"/> <img
											src="gold/js/My97DatePicker/skin/datePicker.gif" width="16"
											height="22"/> </span>
									</div>
								</div>
							</div>

							<div class="col-xs-1 col-sm-3 ">
								<div class="row">
									<div class="col-xs-8 col-sm-4">
										<span class="btn btn-default">有效期结束时间 <input
											type="text"  readonly="readonly" name="cardEndTime" id="endTime"
											onclick="WdatePicker({minDate:'#F{$dp.$D(\'startTime\')||\'%y-%M-%d\'}',dateFmt:'yyyy-MM-dd HH:mm:ss'})"/> <img
											src="gold/js/My97DatePicker/skin/datePicker.gif" width="16"
											height="22" /> </span>
									</div>
								</div>
							</div>

							<div class="col-xs-3 col-sm-3 ">
								<div class="row">
									<div class="col-xs-8 col-sm-2">
										<span class="btn btn-default">省份</span>
									</div>
									<div class="col-xs-3 col-sm-4">
										<select  class="form-control" name="cardProvId">
											<c:forEach items="${provinceList}" var="province">
												<option value="${province.provId }">${province.provName }</option>
											</c:forEach>
										</select>
									</div>
									<div class="col-xs-3 col-sm-4 ">
										<input type="submit" class="btn btn-primary" id="search"
											value="查询" />
									</div>
								</div>
							</div>
						</div>
					</div>
				</div>
			</form>
			
			<div class="row">&nbsp;</div>
			<div class="row">
				<div class="col-xs-6 col-sm-4">
					<a href="toAddCardJsp.do" class="btn btn-primary">批量生成密保卡</a>
					<a class="btn btn-primary" onclick="exportTable()">导出</a>
				</div>
			</div>
			
			<div class="row">&nbsp;</div>
			<div class="row">
				<div class="col-xs-6 col-sm-11">
					<div class="table-responsive"
						style="vertical-align: middle;text-align: center;">
						<table id="searchTable"
							class="table table-bordered table-hover table-condensed  ">
							<tr>
								<td><input type="checkbox" id="all" value="全选"
									 /> 全选</td>
								<td>ID</td>
								<td>卡号</td>
								<td>密码</td>
								<td>金额</td>
								<td>省份</td>
								<td>有效期开始时间</td>
								<td>有效期结束时间</td>
								<td>使用状态</td>
								<td>创建时间</td>
							</tr>
							<c:forEach items="${cardList}" var="card">
								<tr>
									<td><input type='checkbox' 
										name='opt' value='${card.cardId}' /></td>
									<td>${card.cardId}</td>
									<td>${card.cardNumber}</td>
									<td>${card.cardPwd}</td>
									<td>${card.cardAmount}</td>
									<td>${card.cardProv}</td>
									<td>${card.cardStartTime}</td>
									<td>${card.cardEndTime}</td>
									<td>
										${card.cardStatus}
									</td>
									<td>
										${card.cardCreateTime}
									</td>
								</tr>
							</c:forEach>
						</table>

					</div>
				</div>
			</div>
			<div class="row">
				&nbsp;
				<a class="btn btn-primary" href="getAllCardByPage.do?nowPageString=${nowPage-1}">上一页</a>
				<a class="btn btn-primary" href="getAllCardByPage.do?nowPageString=${nowPage+1}">下一页</a>
			</div>
		</div>
	</div>
	<c:if test="${msg!=null}">
  		<script type="text/javascript">
  			alert("${msg}");
  		</script>
  	</c:if>
  	
  	<script type="text/javascript">
  		function exportTable(){
			var arr = [];
			$("input[name='opt']").each(function(){
				var choose = $(this).prop("checked");
				if(choose){
					arr.push($(this).val());
				}
			});
			if(arr.length<=0){
				alert("请选择至少一行！");
				return;
			}
			location.href="exportCard.do?arr="+arr;
  		}
  	</script>
  </body>
  	
</html>
